<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org" lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>快递之家-用户页面</title>
</head>
<link rel="icon" href="data:;base64,=">
<link rel="stylesheet" href="/static/layui/layui/css/layui.css">
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div th:replace="head::UserNavHeader"></div>
    <div th:replace="menu::UserNavMenu"></div>
    <div class="layui-body">
        <!-- 内容主体区域
        <button id="eidt">修改个人信息</button>
        <button id="lookinfo">查看快递信息</button>-->
        <fieldset class="layui-elem-field layui-field-title">
            <legend>个人用户信息</legend>
        </fieldset>
        <form class="layui-form" id="userForm" lay-filter="userForm">
            <div class="layui-form-item">
                <label class="layui-form-label">姓名</label>
                <div class="layui-input-block">
                    <input type="hidden" id="kid" name="kid" th:value="${session.user.getKid()}">
                    <input type="hidden" name="kno">
                    <input type="text" name="kn" required  lay-verify="required" placeholder="请输入姓名" autocomplete="on" class="layui-input" id="eidt_username" style="width:200px">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码框</label>
                <div class="layui-input-inline">
                    <input type="password" name="kpw" required lay-verify="required" placeholder="请输入密码" autocomplete="on" class="layui-input" style="width:200px">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">单选框</label>
                <div class="layui-input-block">
                    <input type="radio" name="ksex" value="男" title="男">
                    <input type="radio" name="ksex" value="女" title="女" checked>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">电话号码</label>
                <div class="layui-input-block">
                    <input type="text" name="ktelephone" required  lay-verify="required" placeholder="请输入电话号码" autocomplete="on" class="layui-input" id="eidt_phone" style="width:200px">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">常用住址</label>
                <div class="layui-input-block">
                    <input type="text" name="kadress" required  lay-verify="required" placeholder="请输入住址" autocomplete="on" class="layui-input" id="eidt_adress" style="width:200px">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">身份证</label>
                <div class="layui-input-block">
                    <input type="text" name="kpid" required  lay-verify="required" placeholder="请输入身份证号码" autocomplete="on" class="layui-input" id="eidt_pid" style="width:200px">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="button" lay-submit="editForm" class="layui-btn layui-btn-normal" lay-filter="sub">提交</button>
                </div>
            </div> 
        </form>
    </div>
    <div th:replace="bottom::NavBottom"></div>
</div>

</body>
<script src="/static/jquery/jquery-3.4.0.js"></script>
<script src="/static/layui/layui/layui.all.js"></script>
<script type="text/javascript">
    layui.use(['jquery','element','form','table','layer','laydate'], function(){
        var $ = layui.jquery;
        var element = layui.element;
        var form = layui.form;
        var table = layui.table;
        var layer = layui.layer;
        var laydate = layui.laydate;
        var kid = $("#kid").val();
        $.ajax({
            url:"/kh/getKhByKid",
            dataType:"json",   //返回格式为json
            async:true,
            data:{"kid":kid},    //参数值
            type:"GET",   //请求方式
            success:function(req){
                //请求成功时处理
                console.log(req);
                console.log(req.data);
                if(req.code === 0){
                    form.val("userForm",req.data);
                    form.render(); //更新全部
                }
            },
            error:function(){
                //请求出错处理
                layer.msg('发送失败', {icon: 5});
            }
        });

        form.on('submit(sub)', function(data){
            $.ajax({
                url:"/kh/update",
                dataType:"json",   //返回格式为json
                async:true,
                data:data.field,    //参数值
                type:"POST",   //请求方式
                success:function(req){
                    //请求成功时处理
                    //console.log(req);
                    if(req.code === 0){
                        layer.msg('修改成功', {icon: 1});
                    }else{
                        layer.msg('发送失败 '+req.msg, {icon: 5});
                    }
                },
                error:function(){
                    //请求出错处理
                    layer.msg('发送失败', {icon: 5});
                }
            });
        });
    });

    /*$("#eidt").on('click', function () {

        layer.open({
            type:1,
            area:['500px','600px'],
            title: '修改个人信息',
            content: $("#test"),
            shade: 0,
            btn: ['提交', '重置']
            ,btn1: function(index, layero){
                var kk=$("#username").val();
                alert(kk);
            },
            btn2: function(index, layero){
                alert("2222");
                return false;
            },
            cancel: function(layero,index){
                layer.closeAll();
            }

        })
    });*/
</script>
</html>